<template>
	<view>
		<span @click="getFind('首页')">首页</span>
		<span @click="getFind('直播')">直播</span>
		<button class="wdbtn" size="large" type="warning" @click="postVideo">+</button>
		<span @click="getFind('发现')">发现</span>
		<span @click="getFind('我的')">我的</span>
		<wd-toast />
	</view>
</template>

<script lang="ts" setup>
import { useToast } from '@/uni_modules/wot-design-uni';

const toast = useToast();

// 页面跳转
const getFind = (item: string) => {
	if (item == '首页') {
		uni.navigateTo({
			url: '/pages/Home/Home'
		});
	} else if (item == '直播') {
		uni.navigateTo({
			url: '/pages/luping/luping'
		});
	} else if (item == '发现') {
		uni.navigateTo({
			url: '/pages/Find/FindPages'
		});
	} else if (item == '我的') {
		uni.navigateTo({
			url: '/pages/Cover/Cover'
		});
	}
};
// 上传视频
const postVideo = () => {
	let REFRESH_token = localStorage.getItem('REFRESH_token') || null;
	let access_token = localStorage.getItem('access_token') || null;
	if (REFRESH_token != null && access_token != null) {
		uni.navigateTo({
			url: '/pages/Post_Video/Post_Video'
		});
	} else {
		toast.error('您还未登录，请先登录');
		let a = setTimeout(() => {
			uni.navigateTo({
				url: '/pages/Login/Login'
			});
			clearTimeout(a);
		}, 2000);
	}
};
</script>

<style scoped lang="scss">
@media (min-width: 800px) {
	view {
		width: 100%;
		height: 80px;
		display: flex;
		justify-content: space-around;
		background-color: black;
		color: white;
		position: fixed;
		bottom: 0;
		span {
			line-height: 80px;
			font-size: 25px;
			font-weight: 700;
		}
		.wdbtn {
			width: 100px;
			height: 70px;
			border-radius: 40px;
			background-color: yellow;
			margin-left: 0%;
			margin-right: 0%;
			font-weight: 700;
			font-size: 50px;
			line-height: 70px;
		}
	}
}
@media (max-width: 800px) {
	view {
		width: 100%;
		height: 70px;
		display: flex;
		justify-content: space-around;
		background-color: black;
		color: white;
		position: fixed;
		bottom: 0;
		span {
			line-height: 70px;
			font-size: 20px;
		}
		.wdbtn {
			width: 70px;
			height: 50px;
			border-radius: 40px;
			margin-left: 0%;
			margin-right: 0%;
			font-weight: 700;
			background-color: yellow;
			font-size: 20px;
			line-height: 50px;
		}
	}
}
</style>
